<template>
	<view style="position: relative;">
		<!-- <image src="../../../static/tuiguang.jpg" style="height: 1181upx;width: 750upx;"></image> -->
		<image :src="qrimg" style="width: 750upx;z-index: 1;" mode="widthFix" @click="pImage(qrimg,1)"></image>
		<!-- <view style="width: 230upx;border-radius: 100upx;background-color: #ccc;color: #fff;text-align: center;line-height: 100upx;height: 100upx;position: fixed;bottom: 50upx;right: 80upx;z-index: 99;font-weight: 555;font-size: 32upx;" @click="saveImgToLocal">
			保存图片
		</view> -->
		<view style="width: 400upx;color: #fff;text-align: center;line-height: 40upx;height: 40upx;position: fixed;bottom: 100upx;left: 60upx;z-index: 99999;font-weight: 555;font-size: 24upx;">
			<image src="../../../static/bg_btn.png" style="width: 630upx;" mode="widthFix" @click="copy"></image>
		</view>
		
		<view style="width: 400upx;color: #000;text-align: center;line-height: 40upx;height: 40upx;position: fixed;top: 180upx;right: 0upx;z-index: 99;font-weight: 555;font-size: 24upx;">
			轻触图片预览,长按分享或保存
		</view>
		
		
		
	</view>
</template>
<script>
	export default {
		data() {
			return {
				qrimg: '',
				openid:'',
				content:'',
			};
		},
		onLoad:function(){
			// uni.showLoading()
			uni.getStorage({
				key: 'openid',
				success: (res) => {
					this.openid = res.data
					this.setAjax()
				},
				fail: () => {
					uni.navigateTo({
						url: '../../login/login'
					});
				}
			});
		},
		methods:{
			setAjax(){
				uni.request({
					url: 'http://weipin.mygodmall.com/app/index.php?i=4&c=entry&m=ewei_shopv2&do=mobile&r=commission.qrcode&app=1',
					method: 'POST',
					data: {'openid':this.openid},
					header:{'Content-Type':'application/x-www-form-urlencoded'},
					success: res => {
						this.qrimg = res.data.result.img
						this.content = res.data.result.url
						// this.qrimg = res.data
						// console.log(res.data)
						// uni.hideLoading()
						// if (res.data.error ==1) {
						// 	uni.showToast({
						// 		title: res.data.message,
						// 		mask: false,
						// 		duration: 1500
						// 	});
						// 	return
						// }
					},
					fail: () => {},
					complete: () => {}
				});
			},
			pImage (img,index) {
				console.log(img,index)
				uni.previewImage({
					current: index,
					urls: [img],
					longPressActions: {
						success: function(data) {},
						fail: function(err) {}
					},
				})
			},
			copy() {
				let content = this.content // 复制内容，必须字符串，数字需要转换为字符串
				const result = this.h5Copy(content)
				if (result === false) {
					uni.showToast({
						title:'不支持',
					})
				} else {
				 uni.showToast({
						title:'复制成功',
						icon:'none'
				 })
				}
			},
			h5Copy(content) {
				if (!document.queryCommandSupported('copy')) {
				  // 不支持
				  return false
				}
				let textarea = document.createElement("textarea")
				textarea.value = content
				textarea.readOnly = "readOnly"
				document.body.appendChild(textarea)
				textarea.select() // 选择对象
				textarea.setSelectionRange(0, content.length) //核心
				let result = document.execCommand("copy") // 执行浏览器复制命令
				textarea.remove()
				return result
			},
			saveImgToLocal(){
				uni.downloadFile({
						url: this.srcimg,//图片地址
						success: (res) =>{
								if (res.statusCode === 200){
										uni.saveImageToPhotosAlbum({
												filePath: res.tempFilePath,
												success: function() {
														uni.showToast({
																title: "保存成功",
																icon: "none"
														});
												},
												fail: function() {
														uni.showToast({
																title: "保存失败",
																icon: "none"
														});
												}
										});
								} 
						}
				})
			},
		}
	}
</script>

<style>
	page {
		background: #116263;
	}
	.tips{background:#fff;padding:16upx 24upx;border-bottom:1px solid #f0f0f0;}.tips .title{width:84upx;margin-right:24upx;color:#000;}.tips .cont{color:#666;}</style>
